<template>
  <div>
    <div class="form-content" v-if="statusParameter" :key="1">
      <p>5.0负责参数表</p>
      <el-form ref="form" class="form-input" :model="formData" label-width="120px" :rules="ruleData">
        <el-row>
          <el-col :span="12">
            <el-form-item label="上传参数表">
              <UploadFile @getfiles="getfiles1" :showFiles="showFiles1"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="自检是否完成">
              <el-switch v-model="formData.complete1"></el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="上传自留表">
              <UploadFile @getfiles="getfiles2" :showFiles="showFiles2"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="自检是否完成">
              <el-switch v-model="formData.complete2"></el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="备注" prop="remarks">
            <el-input type="textarea" v-model="formData.remarks"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="下一流程">
              <el-input v-model="nextNodeNameContent" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="下一流程人员" prop="nextAuthor">
              <el-select placeholder="请选择下一流程人员" v-model="formData.nextAuthor" multiple @change="handleChange">
                <el-option v-for="item in nextAuthorLists" :key="item.id" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="btn-option">
          <el-button type="primary" @click="submit">提交到下一流程</el-button>
          <el-button @click="cancel">取消</el-button>
          <el-button type="warning" @click="back">退回到上一流程</el-button>
        </div>
      </el-form>
    </div>

    <div class="form-content" v-else :key="2">
      <p>5.0负责参数表</p>
      <el-form class="form-input" :model="formData2" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="下载参数表">
              <div v-if="formData2.file1.length > 0">
                <div v-for="item in formData2.file1" :key="item.id" @click="downFile1(item.id)" class="filediv">{{item.fileName}}</div>
              </div>
              <div v-else>未上传文件</div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="自检是否完成">
              <el-switch v-model="formData2.complete1" disabled></el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="下载自留表">
              <div v-if="formData2.file2.length > 0">
                <div v-for="item in formData2.file2" :key="item.id" @click="downFile2(item.id)" class="filediv">{{item.fileName}}</div>
              </div>
              <div v-else>未上传文件</div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="自检是否完成">
              <el-switch v-model="formData2.complete2" disabled></el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="备注">
            <el-input type="textarea" v-model="formData2.remarks" readonly></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="下一流程">
              <el-input v-model="nextNodeNameContent" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="下一流程人员">
              <el-input v-model="formData2.nextAuthor" readonly></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </div>
</template>
<script>
import { EmbodimentCreate } from '@/api/api'
import { nextNodeArr, getName, getMultipleLabel, getFileId, downfile, getAccountBack } from '@/unils/utils'
import Bus from '@/plugins/bus'
import swal from 'sweetalert'
import _ from 'underscore'
import uploadFile from "../flow/upload"
export default {
  props: {
    statusParameter: {
      type: Boolean,
      defalut: true
    }
  },
  components: {
    UploadFile: uploadFile,
  },
  data () {
    return {
      orunid: '',
      formData: {
        complete1: false,
        complete2: false,
        remarks: '',
        nextAuthor: [],
        file1: [],
        file2: []
      },
      labelName: '',
      nextAuthorLists: [],
      nextNodeNameContent: '负责实施方案',
      ruleData: {
        remarks: [{ required: true, message: '请填写备注', trigger: 'blur' }],
        nextAuthor: [{ required: true, message: '请选择下一流程人员!', trigger: 'change' }]
      },
      formData2: {
        complete1: false,
        complete2: false,
        remarks: '',
        nextAuthor: '',
        addName: '',
        file1: [],
        file2: []
      },
      backNextAuthor: '',
      //
      showFiles1: [],
      showFiles2: [],
      fileList2_1: [],
      fileList2_2: []
    };
  },
  mounted () {
    this.fun()
  },
  beforeDestroy () {
    Bus.$off('res')
    Bus.$off('resAuthor')
  },
  methods: {
    handleChange (val) {
      // this.labelName = getMultipleLabel(val, this.nextAuthorLists)
    },
    // 文件操作
    getfiles1 (e) {
      this.formData.file1 = e[0]
      this.fileList2_1 = e[1]
    },
    getfiles2 (e) {
      this.formData.file2 = e[0]
      this.fileList2_2 = e[1]
    },
    downFile1 (id) {
      downfile(id)
    },
    downFile2 (id) {
      downfile(id)
    },
    submit: _.debounce(async function () {
      await this.$refs.form.validate(async (valid) => {
        if (!valid) return false
        let msg = '是否确认提交!'
        // if (this.formData.file1.length == 0 || this.formData.file2.length == 0) {
        //   msg = '检测到有文件没提交，是否确认提交!'
        // }
        await this.confirm(msg, async () => {
          let file1Obj = await getFileId(this, this.formData.file1, 1, 5)
          let file2Obj = await getFileId(this, this.formData.file2, 1, 5)
          let params = {
            radio6: this.formData.complete1,
            radio7: this.formData.complete2,
            remarks5: this.formData.remarks,
            orunid: this.orunid,
            status: 'current',
            type: 2,
            addName: this.formData2.addName,
            currentNodeName: '5.0负责参数表',
            currentNodeID: 'T10006',
            nextNodeID: 'T10007',
            nodeTowardsInfo: nextNodeArr(this.$store.state.jobAccount, this.formData.nextAuthor, 'T10007', '6.0负责实施方案', 'T10006', '5.0负责参数表'),
            paramFile: JSON.stringify(file1Obj.concat(this.fileList2_1)),
            formFile: JSON.stringify(file2Obj.concat(this.fileList2_2))
          }
          EmbodimentCreate(params)
            .then((res) => {
              // console.log(res)
              if (res.code == 200) {
                this.alertok('提交成功', () => {
                  this.$router.go(-1)
                })
              } else {
                swal('错误', res.message || '网络连接错误', 'warning')
              }
            })
            .catch((err) => {
              swal('错误', '网络连接错误', 'error')
            })
        })
      })
    }),
    cancel () {
      this.$router.go(-1)
    },
    async back () {
      if (!this.formData.remarks) {
        swal('错误', '请在备注填写退回原因！', 'warning')
        return
      }
      await this.confirm('是否确认退回', async () => {
        let file1Obj = await getFileId(this, this.formData.file1, 1, 5)
        let file2Obj = await getFileId(this, this.formData.file2, 1, 5)
        let params = {
          radio6: this.formData.complete1,
          radio7: this.formData.complete2,
          remarks5: this.formData.remarks,
          orunid: this.orunid,
          status: 'current',
          type: 0,
          currentNodeName: '5.0负责参数表',
          currentNodeID: 'T10006',
          nextNodeID: 'T10005',
          nodeTowardsInfo: nextNodeArr(this.$store.state.jobAccount, [this.backNextAuthor], 'T10005', '4.0负责预算', 'T10006', '5.0负责参数表'),
          paramFile: JSON.stringify(file1Obj.concat(this.fileList2_1)),
          formFile: JSON.stringify(file2Obj.concat(this.fileList2_2))
        }
        EmbodimentCreate(params)
          .then((res) => {
            // console.log(res)
            if (res.code == 200) {
              this.alertok('提交成功', () => {
                this.$router.go(-1)
              })
            } else {
              swal('错误', res.message || '网络连接错误', 'warning')
            }
          })
          .catch((err) => {
            swal('错误', '网络连接错误', 'error')
          })
      })
    },
    fun () {
      Bus.$on('resAuthor', res => {
        this.nextAuthorLists = res
      })
      Bus.$on('res', res => {
        this.orunid = res.data.orunid
        this.formData2.complete1 = JSON.parse(res.data.radio6)
        this.formData2.complete2 = JSON.parse(res.data.radio7)
        this.formData2.remarks = res.data.remarks5
        if (!this.statusParameter) {
          // 判断是不是回退到'T10005'，如果是，则不赋值
          let arr = JSON.parse(res.data.nodeTowardsInfo)
          let obj = {}
          obj = arr.find(item => {
            return item.currentNodeID === 'T10006'
          })
          if (obj.nextNodeID === 'T10005') {
            this.formData2.nextAuthor = ''
          } else {
            this.formData2.nextAuthor = obj.nextAuthor
          }
        }
        this.formData2.addName = res.data.addName
        if (res.data.paramFile != null && JSON.parse(res.data.paramFile).length > 0) {
          this.formData2.file1 = JSON.parse(res.data.paramFile)
          this.showFiles1 = JSON.parse(res.data.paramFile)
          this.fileList2_1 = JSON.parse(res.data.paramFile)
        }
        if (res.data.formFile != null && JSON.parse(res.data.formFile).length > 0) {
          this.formData2.file2 = JSON.parse(res.data.formFile)
          this.showFiles2 = JSON.parse(res.data.budgetFile)
          this.fileList2_2 = JSON.parse(res.data.budgetFile)
        }
        // 获取要退回到的上一流程人
        this.backNextAuthor = getAccountBack(res.data.nodeTowardsInfo, 'T10005')
      })
    }
  },
};
</script>
<style lang="less" scoped>
.form-content {
  font-size: 30px;
  p {
    text-align: center;
    margin-bottom: 40px;
  }
  .form-input {
    width: 70%;
    // background-color: blue;
    margin: auto;
    .btn-option {
      display: flex;
      justify-content: flex-end;
    }
  }
}
</style>